<!Doctype>
<html>
<head>
<title></title>
<style>
#spring{background-image: url(1.jpg); background-repeat:no-repeat;}
#summer{background-image: url(2.jpg); background-repeat:no-repeat;}
#autumn{background-image: url(3.jpg); background-repeat:no-repeat;}
#winter{background-image: url(4.jpg); background-repeat:no-repeat;}
</style>
<script type="text/javascript">
		var thebody=document.getElementsByTagName('body');
		function changeSpring() {
			thebody[0].id='spring';
			
		}
		function changeSummer(){
			thebody[0].id='summer';
		}
		function changeAutumn() {
			thebody[0].id='autumn';
		}
		function changeWinter(){
			thebody[0].id='winter';
		}
		//changespring();
		//changesummer();
		//changeautumn();
		//changewinter();
	</script>



</head>
<body>
<div>
<div>
	<button  onclick="changeSpring()" id="spring">spring</button>
	<button  onclick="changeSummer()" id="summer">summer</button>
	<button  onclick="changeAutumn()" id="autumn">autumn</button>
	<button  onclick="changeWinter()" id="winter">winter</button>
	</div>
</div>
</body>
</html>